<template>
  <div>
    <Card shadow>
        <iview-table
            ref="table"
            :baseURL="queryModel.baseURL"
            :menuId="dataModel.menuId"
            :columns="dataModel.columns"
            :order="dataModel.order"
            :pageNumber="pageModel.pageNumber"
            :pageSize="pageModel.pageSize"
            v-on="{changeSelect:changeSelect,changeTotalSize:changeTotalSize,events:events}">
        </iview-table>
        <br>
        <iview-page 
            :totalSize="pageModel.totalSize"
            :pageNumber="pageModel.pageNumber" 
            :pageSize="pageModel.pageSize"
            :pageSizeOpts="pageModel.pageSizeOpts"
            v-on="{changePageNumber:changePageNumber,changePageSize:changePageSize}">
        </iview-page>
    </Card>
    <Modal v-model="showAppointment" :closable='false' :mask-closable=true :width="500">
        <h3 slot="header" style="color:#2D8CF0">改约</h3>
        <Row justify="center" class="code-row-bg">
            <Col span="20" offset="2">
                <Form :model="selectRow" :label-width="100" label-position="right">
                    <FormItem label="改约时间：" prop="appointment">
                        <DatePicker v-model="selectRow.appointment" @on-change="changeDateTime" type="datetime" format="yyyy-MM-dd HH:mm" placeholder="请选择时间..." style="width: 100%"></DatePicker>
                    </FormItem>
                    <FormItem label="改约医生：" prop="doctorId">
                        <Select v-model="selectRow.doctorId" clearable filterable placeholder="请选择医生..." :label-in-value=true @on-change="changeDoctor">
                            <Option v-for="item in healthcare" v-if="item.job === 1" :value="item.id" :key="item.id">{{item.username}}</Option>
                        </Select>
                    </FormItem>
                    <FormItem label="改约护士：" prop="nurseId">
                        <Select v-model="selectRow.nurseId" clearable filterable placeholder="请选择护士..." :label-in-value=true @on-change="changeNurse">
                            <Option v-for="item in healthcare" v-if="item.job === 2" :value="item.id" :key="item.id">{{item.username}}</Option>
                        </Select>
                    </FormItem>
                    <FormItem label="改约备注：" prop="note">
                        <Input v-model="selectRow.note" type="textarea" :autosize="{minRows: 3,maxRows: 5}" placeholder="请输入内容..."></Input>
                    </FormItem>
                </Form>
            </Col>
        </Row>
        <div slot="footer">
            <Button type="info" @click="doChange">提交</Button>
        </div>
    </Modal>
  </div>
</template>

<script>
import iviewTable from '@/view/common/table/Table.vue';
import iviewPage from '@/view/common/page/Page.vue';
import expandRow from './ReservationExpand.vue';
export default {
    components: {
        iviewTable,
        iviewPage,
        expandRow
    },
    data () {
        return {
            baseURL: '/user/reservation',
            // 考勤
            attendanceURL: '/user/attendance',
            selectRows: [],
            selectRow: {},
            healthcare: [],
            showAppointment: false,
            queryModel: {
                // 网关代理路径(必须)+资源路径(可选)
                baseURL: '/user/reservation'
            },
            dataModel: {
                menuId: 510,
                columns: [
                    {
                        type: 'expand',
                        width: 50,
                        render: (h, params) => {
                            return h(expandRow, {
                                props: {
                                    row: params.row
                                }
                            })
                        }
                    },{
                        type: 'selection',
                        width: 60,
                        align: 'center'
                    },{
                        title: '预约患者',
                        key: 'patientName'
                    },{
                        title: '预约类型',
                        key: 'type',
                        render: (h, params) => {
                            let temp = params.row.type
                            if (temp === 1) {
                                temp = '会员预约'
                            } else if (temp === 2) {
                                temp = '非会员预约'
                            }
                            return temp
                        }
                    },{
                        title: '提醒方式',
                        key: 'remind',
                        render: (h, params) => {
                            let temp = params.row.remind
                            if (temp === 1) {
                                temp = '短信'
                            } else if (temp === 2) {
                                temp = '微信'
                            } else if (temp === 3) {
                                temp = '电话'
                            }
                            return temp
                        }
                    },{
                        title: '处理方式',
                        key: 'process',
                        render: (h, params) => {
                            let temp = params.row.process
                            if (temp === 1) {
                                temp = '电话随访'
                            } else if (temp === 2) {
                                temp = '预约到店'
                            }
                            return temp
                        }
                    },{
                        title: '预约医生',
                        key: 'doctorName'
                    },{
                        title: '接待人',
                        key: 'nurseName'
                    },{
                        title: '预约时间',
                        key: 'appointment',
                        type: 'Data'
                    },{
                        title: '预约状态',
                        key: 'status',
                        render: (h, params) => {
                            let temp = params.row.status
                            if (temp === 0) {
                                temp = '新记录'
                            } else if (temp === 5) {
                                temp = '已取消'
                            }
                            return temp
                        }
                    }
                ],
                order: 'creation_time desc'
            },
            pageModel: {
                totalSize: 0,
                pageNumber: 1,
                pageSize: 10,
                pageSizeOpts: [10, 50, 100, 500]
            }
        }
    },
    methods: {
        events (item) {
            if (item.path === 'change') {
                this.change()
            } else if (item.path === 'delete') {
                this.delete()
            }
        },
        change () {
            if (this.selectRows.length === 1) {
                let row = this.selectRows[0]
                let url = this.baseURL + '/checkChange/' + row.id
                this.$ajax.get(url).then((response) => {
                    let {code, data, msg} = response.data
                    if (code === 0) {
                        if (data) {
                            // 对象属性复制
                            Object.assign(this.selectRow, this.selectRows[0])
                            this.selectRow.appointment = ''
                            this.selectRow.doctorId = ''
                            this.selectRow.nurseId = ''
                            this.selectRow.note = ''
                            this.showAppointment = true
                        } else {
                            this.$bus.alert('warning', '不符合条件')
                        }
                    } else {
                        this.$bus.modal('error', '系统提示', msg)
                    }
                })
            } else {
                this.$bus.alert('warning', '请选择一条记录')
            }
        },
        doChange () {
            let url = this.baseURL + '/change'
            this.$ajax.post(url, this.selectRow).then((response) => {
                let {code, msg} = response.data
                if (code === 0) {
                    this.showAppointment = false
                    this.$bus.alert('success', msg)
                    this.refresh()
                } else {
                    this.$bus.alert('error', msg)
                }
            })
        },
        delete () {
            if (this.selectRows.length > 0) {
                let ids = []
                for (let row of this.selectRows) {
                    ids.push(row.id)
                }
                let url = this.baseURL + '/checkDelete'
                this.$ajax.post(url, ids).then((response) => {
                    let {code, data} = response.data
                    if (code === 0) {
                        if (data.length > 0) {
                            if (data.length === this.selectRows.length) {
                                this.doDelete(data)
                            } else {
                                this.$Modal.confirm({
                                    title: '操作提示',
                                    content: '<p>可以删除'+data.length+'条记录，确认删除?</p>',
                                    onOk: () => {
                                        this.doDelete(data)
                                    }
                                })
                            }
                        } else {
                            this.$bus.alert("warning", "没有符合条件的记录")
                        }
                    }
                })
            } else {
                this.$bus.alert('warning', '请至少选择一条记录')
            }
        },
        doDelete (ids) {
            let url = this.baseURL + '/delete'
            this.$ajax.post(url, ids).then((response) => {
                let {code, msg} = response.data
                if (code === 0) {
                    this.$bus.alert('success', msg)
                    this.refresh()
                } else {
                    this.$bus.alert('error', msg)
                }
            })
        },
        refresh () {
            this.$refs.iviewTable.refresh()
        },
        changeSelect (selection) {
            this.selectRows = selection
        },
        changeTotalSize (totalSize) {
            this.pageModel.totalSize = totalSize
        },
        changePageNumber (pageNumber) {
            this.pageModel.pageNumber = pageNumber
        },
        changePageSize (pageSize) {
            this.pageModel.pageSize = pageSize
        },
        changeDateTime (val, type) {
            if (val !== '') {
                let url = this.attendanceURL + '/getHealthcare/' + val + ':00/' + this.selectRow.type
                this.$ajax.get(url).then((response) => {
                    let {code, data} = response.data
                    if (code === 0) {
                        this.healthcare = data
                    }
                })
            }else{
                // 清空已选的医护
                this.healthcare = []
            }
        },
        changeDoctor (option) {
            this.selectRow.doctorId = option.value
            this.selectRow.doctorName = option.label
        },
        changeNurse (option) {
            this.selectRow.nurseId = option.value
            this.selectRow.nurseName = option.label
        },
        init () {
            this.$refs.table.refresh()
        }
    },
    mounted () {
        this.init()
    }
}
</script>

<style>

</style>
